<!DOCTYPE html>
<html lang="zh-cmn-Hans">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />

  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <meta http-equiv="Expires" content="0">
  <meta http-equiv="Pragma" content="no-cache">
  <meta http-equiv="Cache-control" content="no-cache">
  <meta http-equiv="Cache" content="no-cache">
  <meta id="metaInfo" data="<%= htmlWebpackPlugin.options.metaInfo %>">
  <title>勤税宝平台</title>
  <title id="version"><%= htmlWebpackPlugin.options.title %></title>
  <!-- <script src="./static/vconsole.min.js"></script> -->
  <link rel="stylesheet" href="./static/animate.4.1.1.min.css" />
  <script src="./static/pdfobject.min.js" defer></script>
  <script src="./static/MutationObserver.js" defer rel="prefetch"></script>
   <script src="./static/systemVersion.js" defer rel="prefetch"></script>
  <link rel="icon" href="<%= BASE_URL %>logo.png">
  <script src="<%= BASE_URL %>cdn/babel-polyfill/polyfill_7_2_5.js"></script>
  <script>
    // 用于全局的数据共享
    window['globalData'] = {
      isGoto:false, // /capitalAccount/myAccount
      gotoPath:'/index/index'
    }
  </script>
  <style>
    html,
    body,
    #app {
      height: 100%;
      margin: 0px;
      padding: 0px;
    }
    .chromeframe {
      margin: 0.2em 0;
      background: #ccc;
      color: #000;
      padding: 0.2em 0;
    }
    #loader-wrapper {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 999999;
    }
    #loader {
      display: block;
      position: relative;
      left: 50%;
      top: 50%;
      width: 125px;
      height: 110px;
      margin: -75px 0 0 -75px;
      border-radius: 50%;
      border: 3px solid transparent;
      /* Chrome, Firefox 16+, IE 10+, Opera */
      z-index: 1001;
    }
    @-webkit-keyframes spin {
      0% {
        -webkit-transform: rotate(0deg);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg);
        /* IE 9 */
        transform: rotate(0deg);
        /* Firefox 16+, IE 10+, Opera */
      }
      100% {
        -webkit-transform: rotate(360deg);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg);
        /* IE 9 */
        transform: rotate(360deg);
        /* Firefox 16+, IE 10+, Opera */
      }
    }
    @keyframes spin {
      0% {
        -webkit-transform: rotate(0deg);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg);
        /* IE 9 */
        transform: rotate(0deg);
        /* Firefox 16+, IE 10+, Opera */
      }
      100% {
        -webkit-transform: rotate(360deg);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg);
        /* IE 9 */
        transform: rotate(360deg);
        /* Firefox 16+, IE 10+, Opera */
      }
    }
    #loader-wrapper .loader-section {
      position: fixed;
      top: 0;
      width: 51%;
      height: 100%;
      background: #4266E5;
      /* Old browsers */
      z-index: 1000;
      -webkit-transform: translateX(0);
      /* Chrome, Opera 15+, Safari 3.1+ */
      -ms-transform: translateX(0);
      /* IE 9 */
      transform: translateX(0);
      /* Firefox 16+, IE 10+, Opera */
    }
    #loader-wrapper .loader-section.section-left {
      left: 0;
    }
    #loader-wrapper .loader-section.section-right {
      right: 0;
    }
    /* Loaded */
    .loaded #loader-wrapper .loader-section.section-left {
      -webkit-transform: translateX(-100%);
      /* Chrome, Opera 15+, Safari 3.1+ */
      -ms-transform: translateX(-100%);
      /* IE 9 */
      transform: translateX(-100%);
      /* Firefox 16+, IE 10+, Opera */
      -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
      transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }
    .loaded #loader-wrapper .loader-section.section-right {
      -webkit-transform: translateX(100%);
      /* Chrome, Opera 15+, Safari 3.1+ */
      -ms-transform: translateX(100%);
      /* IE 9 */
      transform: translateX(100%);
      /* Firefox 16+, IE 10+, Opera */
      -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
      transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }
    .loaded #loader {
      opacity: 0;
      -webkit-transition: all 0.3s ease-out;
      transition: all 0.3s ease-out;
    }
    .loaded #loader-wrapper {
      visibility: hidden;
      -webkit-transform: translateY(-100%);
      /* Chrome, Opera 15+, Safari 3.1+ */
      -ms-transform: translateY(-100%);
      /* IE 9 */
      transform: translateY(-100%);
      /* Firefox 16+, IE 10+, Opera */
      -webkit-transition: all 0.3s 1s ease-out;
      transition: all 0.3s 1s ease-out;
    }
    /* JavaScript Turned Off */
    .no-js #loader-wrapper {
      display: none;
    }
    .no-js h1 {
      color: #222222;
    }
    #loader-wrapper .load_title {
      font-family: 'Open Sans';
      color: #FFF;
      font-size: 14px;
      width: 100%;
      text-align: center;
      z-index: 9999999999999;
      position: absolute;
      top: 60%;
      opacity: 1;
      line-height: 30px;
    }
    #loader-wrapper .load_title span {
      font-weight: normal;
      font-style: italic;
      font-size: 14px;
      color: #FFF;
      opacity: 0.5;
    }
    /* 滚动条优化 start */
    ::-webkit-scrollbar{
      width:8px;
      height:8px;
    }
    ::-webkit-scrollbar-track{
      background: #f6f6f6;
      border-radius:2px;
    }
    ::-webkit-scrollbar-thumb{
      background: #cdcdcd;
      border-radius:2px;
    }
    ::-webkit-scrollbar-thumb:hover{
      background: #747474;
    }
    ::-webkit-scrollbar-corner {
      background: #f6f6f6;
    }
    /* 滚动条优化 end */
    [use-data-title-v='true'],[use-data-title]{
      cursor:copy;
    }
/*
    .ant-btn {
      animation: throttle 2s step-end forwards;
    }

    .ant-btn:active {
      animation: none;
    }

    @keyframes throttle {
      from {
        pointer-events: none;
        opacity: .65;
      }

      to {
        pointer-events: all;
        opacity: 1;
      }
    }*/

  </style>
  <style>
    .test_class{
        padding-bottom: constant(safe-area-inset-bottom, 20vh);
        padding-bottom: env(safe-area-inset-bottom, 20vh);
        padding-top: constant(safe-area-inset-top);
        padding-top: env(safe-area-inset-top);
    }
</style>
<script>
  // window.onload = function() {
  //   if (sessionStorage.getItem('versionChecked')) {
  //     setTimeout(function() {
  //       sessionStorage.removeItem('versionChecked');
  //     }, 60000);
  //   }
  // };

  const isElementInViewport = (element) => {
    const rect = element.getBoundingClientRect();
    const res = (
        rect.top >= 0 &&
        rect.left >= 0 &&
        rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
        rect.right <= (window.innerWidth || document.documentElement.clientWidth)
    );
    // console.log('当前元素是否在可视区域内==》',res,rect,rect.bottom,window.innerHeight || document.documentElement.clientHeight);
    return {res,itemH:rect.height,bottom:rect.bottom,conH:window.innerHeight || document.documentElement.clientHeight}
  }

/**
* 获取当前浏览器信息
* @returns {object} 包含浏览器名称和版本号的对象.
*/
const getBrowserInfo = () => {
  const userAgent = window.navigator.userAgent.toLowerCase()

  // 检查userAgent以确定浏览器类型
  const isIE = userAgent.includes('msie') || userAgent.includes('trident')
  const isEdge = userAgent.includes('edg/')
  const isFirefox = userAgent.includes('firefox/')
  const isChrome = userAgent.includes('chrome/')
  const isSafari = userAgent.includes('safari/') && !isChrome
  var isMobile = !!(userAgent.match(/(iPhone|iPad|iPod)/i) || userAgent.match(/Android/i) || userAgent.match(/Windows Phone/i) || userAgent.match(/IEMobile/i));
  // 从userAgent中提取版本号
  const version = ((isIE && userAgent.match(/(msie|rv:)\s?([\d.]+)/)?.[2]) || (isEdge && userAgent.match(/edg\/([\d.]+)/)?.[1]) || (isFirefox && userAgent.match(/firefox\/([\d.]+)/)?.[1]) || (isChrome && userAgent.match(/chrome\/([\d.]+)/)?.[1]) ||  (isSafari && userAgent.match(/version\/([\d.]+)/)?.[1]) || '' )

  // 根据浏览器类型返回名称
  const name = (
      (isIE && 'ie') ||
      (isEdge && 'Edge') ||
      (isFirefox && 'Firefox') ||
      (isChrome && 'Chrome') ||
      (isSafari && 'Safari') ||
      ''
  )

  // 返回包含浏览器名称和版本号的对象
  return {
      name,
      version,
      isMobile,
      userAgent,
      navigator
  }
}

</script>
  <!-- 全局配置 -->
  <script src="<%= BASE_URL %>static/config.js"></script>
</head>

<body>
<div id="app" class="test_class">
  <div id="loader-wrapper">
    <div class="loader-section section-left"></div>
    <div class="loader-section section-right"></div>
    <div id="loader"><img src="./loading.gif" alt=""></div>
    <div class="load_title">正在加载勤税宝平台,请耐心等待

    </div>
  </div>
</div>
<script>
  // var vConsole = new window.VConsole();
  // console.log('ceshi ===>',getBrowserInfo());
</script>
</body>

</html>
